<template>
  <a-drawer
    v-model:visible="vdata.visible"
    :mask-closable="true"
    title="代理商审核"
    :body-style="{ paddingBottom: '80px' }"
    width="40%"
    class="drawer-width"
    @close="onClose"
  >
    <a-form v-if="vdata.visible" ref="infoFormModel" :model="vdata.saveObject" layout="vertical" :rules="vdata.rules">
      <a-row justify="space-between" type="flex">
        <a-col :span="10">
          <a-form-item label="代理商名称" name="agentName">
            <a-input
              v-model:value="vdata.saveObject['agentName']"
              placeholder="请输入代理商名称"
              :disabled="true"
            />
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item label="登录名" name="loginUsername">
            <a-input
              v-model:value="vdata.saveObject['loginUsername']"
              placeholder="请输入代理商登录名"
              :disabled="true"
            />
          </a-form-item>
        </a-col>
      </a-row>

      <a-row justify="space-between" type="flex">
        <a-col :span="10">
          <a-form-item label="代理商简称" name="agentShortName">
            <a-input
              v-model:value="vdata.saveObject['agentShortName']"
              placeholder="请输入代理商简称"
              :disabled="true"
            />
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item label="联系人姓名" name="contactName">
            <a-input
              v-model:value="vdata.saveObject['contactName']"
              placeholder="请输入联系人姓名"
              :disabled="true"
            />
          </a-form-item>
        </a-col>
      </a-row>
      <a-row justify="space-between" type="flex">
        <a-col :span="10">
          <a-form-item label="联系人邮箱" name="contactEmail">
            <a-input
              v-model:value="vdata.saveObject['contactEmail']"
              placeholder="请输入联系人邮箱"
              :disabled="true"
            />
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item label="联系人手机号" name="contactTel">
            <a-input
              v-model:value="vdata.saveObject['contactTel']"
              placeholder="请输入联系人手机号"
              :disabled="true"
            />
          </a-form-item>
        </a-col>
      </a-row>
      <a-row justify="space-between" type="flex">
        <a-col :span="10">
          <a-form-item label="服务商号" name="isvNo">
            <a-select v-model:value="vdata.saveObject['isvNo']" :disabled="true" placeholder="请选择服务商">
              <a-select-option v-for="d in vdata.isvList" :key="d.isvNo" v-model:value="d.isvNo">
                {{ d.isvName + " [ ID: " + d.isvNo + " ]" }}
              </a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item label="是否允许发展下级代理" name="addAgentFlag">
            <a-radio-group v-model:value="vdata.saveObject['addAgentFlag']" :disabled="true">
              <a-radio :value="1">
                是
              </a-radio>
              <a-radio :value="0">
                否
              </a-radio>
            </a-radio-group>
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item label="是否允许发展下级商户" name="addMchFlag">
            <a-radio-group v-model:value="vdata.saveObject['addMchFlag']" :disabled="true">
              <a-radio :value="1">
                是
              </a-radio>
              <a-radio :value="0">
                否
              </a-radio>
            </a-radio-group>
          </a-form-item>
        </a-col>
      </a-row>
      <a-row justify="space-between" type="flex">
        <a-col :span="24">
          <a-divider orientation="left">
            <a-tag color="#FF4B33">
              账户信息
            </a-tag>
          </a-divider>
        </a-col>
      </a-row>
      <a-row justify="space-between" type="flex">
        <a-col :span="10">
          <a-form-item label="代理商类型" name="agentType">
            <a-select v-model:value="vdata.saveObject['agentType']" :disabled="true">
              <a-select-option :value="1">个人</a-select-option>
              <a-select-option :value="2">企业</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item label="收款账户类型" name="settAccountType">
            <a-select v-model:value="vdata.saveObject['settAccountType']" :disabled="true">
              <a-select-option value="">未选择</a-select-option>
              <a-select-option value="ALIPAY_CASH">个人支付宝</a-select-option>
              <a-select-option value="BANK_PUBLIC">对公账户</a-select-option>
              <a-select-option value="BANK_PRIVATE">对私账户</a-select-option>
              <a-select-option value="BANK_CARD">银行卡</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
      </a-row>
      <a-row v-if="vdata.saveObject['settAccountType'] === 'ALIPAY_CASH'" justify="space-between" type="flex">
        <a-col :span="10">
          <a-form-item label="账户姓名">
            <a-input
              v-model:value="vdata.saveObject['settAccountName']"
              :disabled="true"
            />
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item label="支付宝账号">
            <a-input
              v-model:value="vdata.saveObject['settAccountNo']"
              :disabled="true"
            />
          </a-form-item>
        </a-col>
      </a-row>
      <a-row v-if="vdata.saveObject['settAccountType'] === 'BANK_PRIVATE'" justify="space-between" type="flex">
        <a-col :span="10">
          <a-form-item label="账户姓名">
            <a-input
              v-model:value="vdata.saveObject['settAccountName']"
              :disabled="true"
            />
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item label="开户银行名称">
            <a-input
              v-model:value="vdata.saveObject['settAccountBank']"
              :disabled="true"
            />
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item label="收款银行卡号">
            <a-input
              v-model:value="vdata.saveObject['settAccountNo']"
              :disabled="true"
            />
          </a-form-item>
        </a-col>
      </a-row>
      <a-row v-if="vdata.saveObject['settAccountType'] === 'BANK_PUBLIC'" justify="space-between" type="flex">
        <a-col :span="10">
          <a-form-item label="对公账户名称">
            <a-input
              v-model:value="vdata.saveObject['settAccountName']"
              :disabled="true"
            />
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item label="对公账号">
            <a-input
              v-model:value="vdata.saveObject['settAccountNo']"
              :disabled="true"
            />
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item label="开户银行名称">
            <a-input
              v-model:value="vdata.saveObject['settAccountBank']"
              :disabled="true"
            />
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item label="开户行支行名称">
            <a-input
              v-model:value="vdata.saveObject['settAccountSubBank']"
              :disabled="true"
            />
          </a-form-item>
        </a-col>
      </a-row>
      <a-row justify="space-between" type="flex">
        <a-col :span="24">
          <a-divider orientation="left">
            <a-tag color="#FF4B33">
              资料信息
            </a-tag>
          </a-divider>
        </a-col>
      </a-row>
      <a-row justify="space-between" type="flex">
        <a-col :span="10">
          <a-form-item label="营业执照照片" name="licenseImg">
            <JeepayUpload v-if="vdata.saveObject['licenseImg']" v-model:src="vdata.saveObject['licenseImg']" bizType="applyment" />
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item label="开户许可证照片" name="permitImg">
            <JeepayUpload v-if="vdata.saveObject['permitImg']" v-model:src="vdata.saveObject['permitImg']" bizType="applyment" />
          </a-form-item>
        </a-col>
      </a-row>
      <a-row justify="space-between" type="flex">
        <a-col :span="10">
          <a-form-item :label="vdata.saveObject['agentType'] == 1?'[联系人]身份证人像面照片':'[法人]身份证人像面照片'" name="idcard1Img">
            <JeepayUpload v-if="vdata.saveObject['idcard1Img']" v-model:src="vdata.saveObject['idcard1Img']" bizType="applyment" />
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item :label="vdata.saveObject['agentType'] == 1?'[联系人]身份证国徽面照片':'[法人]身份证国徽面照片'" name="idcard2Img">
            <JeepayUpload v-if="vdata.saveObject['idcard2Img']" v-model:src="vdata.saveObject['idcard2Img']" bizType="applyment" />
          </a-form-item>
        </a-col>
      </a-row>
      <a-row justify="space-between" type="flex">
        <a-col :span="10">
          <a-form-item label="[联系人]手持承诺函照片" name="idcardInHandImg">
            <JeepayUpload v-if="vdata.saveObject['idcardInHandImg']" v-model:src="vdata.saveObject['idcardInHandImg']" bizType="applyment" />
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item label="银行卡照片" name="bankCardImg">
            <JeepayUpload v-if="vdata.saveObject['bankCardImg']" v-model:src="vdata.saveObject['bankCardImg']" bizType="applyment" />
          </a-form-item>
        </a-col>
      </a-row>
      <a-row justify="space-between" type="flex">
        <a-col :span="24">
          <a-form-item label="审核备注" name="auditRemark">
            <a-textarea v-model:value="vdata.saveObject['auditRemark']" placeholder="请输入审核备注" type="textarea" />
          </a-form-item>
        </a-col>
      </a-row>
    </a-form>
    <div class="drawer-btn-center">
      <a-button :style="{ marginRight: '8px' }" style="margin-right:8px" @click="handleOkFunc(0)">
        <close-outlined />
        审核驳回
      </a-button>
      <a-button style="margin-right:8px" type="primary" :loading="vdata.btnLoading" @click="handleOkFunc(1)">
        <check-outlined />
        审核通过
      </a-button>
    </div>
  </a-drawer>
</template>

<script lang="ts" setup>
import { API_URL_AGENT_LIST, API_URL_ISV_LIST, req  } from '@/api/manage'
import { message }  from 'ant-design-vue'
import { defineProps, reactive, ref, getCurrentInstance } from 'vue'
 
  const props = defineProps({
    callbackFunc: { type: Function, default:null }
  })

  const { $infoBox } = getCurrentInstance()!.appContext.config.globalProperties

  const checkIsvNo = (rule, value) => { // 校验是否选择了服务商
    if (!value) {
      return Promise.reject(new Error('请选择服务商'))
    }
    return Promise.resolve()
  }
  const infoFormModel = ref()
  const infoTable =ref()
  const vdata : any = reactive({
    btnLoading: false,
    saveObject: { isNotify: 0 }, // 数据对象
    recordId: null, // 更新对象ID
    visible: false, // 是否显示弹层/抽屉
    isvList: [] as any, // 服务商下拉列表
    rules: {
    },
  })

  function show (recordId) { // 弹层打开事件
    if (infoFormModel.value != undefined) {
      infoFormModel.value.resetFields()
    }
    
    req.list(API_URL_ISV_LIST, { 'pageSize': -1, 'state': 1 }).then(res => { // 服务商下拉选择列表
      vdata.isvList = res.records
    })
    
    vdata.recordId = recordId
    req.getById(API_URL_AGENT_LIST, recordId).then(res => {
      vdata.saveObject = res
    })
    vdata.visible = true
  }

  function handleOkFunc (value) { // 点击【审核通过】按钮事件
    if(value === 0 && !vdata.saveObject.auditRemark) {
      return message.error('请输入审核备注')
    }
    
    $infoBox.confirmPrimary(value === 1 ? '确认审核通过吗？' : '确认审核驳回吗？', '', () => {
      vdata.btnLoading = true
      req.updateById(API_URL_AGENT_LIST + `/audit`, vdata.recordId, { auditState: value, auditRemark: vdata.saveObject.auditRemark }).then(res => {
        message.success(value === 1 ? '审核已通过' : '审核已驳回')
        vdata.visible = false
        props.callbackFunc() // 刷新列表
        vdata.btnLoading = false
      }).catch(res => {
        vdata.btnLoading = false
      })
    })
  }

  function onClose () {
    vdata.visible = false
  }

defineExpose({
  show
})
</script>
<style lang="less">
  .typePopover {
    position: absolute;
    top: 0;
    left:62px;
  }
</style>
